﻿@{
    ViewBag.Title = "练习";
    Layout = "~/Views/Shared/_GridCommonLayout.cshtml";
}





<style type="text/css">

.smart-form .multiselect-container   .checkbox input {
  
    position: static;
}
</style>

<!--begin grid code-->


<input type="hidden" value="@ViewBag.CourseID" id="courseId" />
<section id="widget-grid" class="">
    <div class="row">




        <!--Operation-->
        <div class="heading-buttons">


            <div class="col-xs-12 col-sm-7 col-md-7 col-lg-4">
                <h1 class="page-title txt-color-blueDark"><i class="fa fa-desktop fa-fw "></i>
                    习题集
			
                </h1>
            </div>
            <div class="buttons pull-right">

                <a class="btn btn-inverse" href="/Teacher/PraStatistics?CourseId=@ViewBag.CourseID">统计</a>

                <a href="#myModal" role="button" class="btn btn-success"
                    data-toggle="modal">发布练习题</a>

                <button type="button" class="btn btn-primary btn-labeled "
                    data-bind="click: $root.onDataDeleting">
                    <span class="btn-label"><i class="glyphicon glyphicon-remove"></i>
                    </span>批量删除</button>


            </div>
            <div style="clear: both;">
            </div>
        </div>
        <!--/Operation-->




        <!--Search-->
        <div class="filter-bar">
            <form id="formSearch">
                <div class="lbl glyphicons search" style="cursor: pointer;" data-bind="click: $root.search">
                    <i></i>筛选
                </div>

                <div>
                    <label>练习名：</label><div class='input-append'>
                        <input id='txtbSrSPracticeName' name='txtbSrSPracticeName' type='text' placeholder='练习名' class='input-mini' style='width: 120px;' />
                    </div>
                </div>
                <input id='txtbSrICourseId' name='txtbSrICourseId' type='hidden' value="@ViewBag.CourseID" />
                <input id='txtbSrITeaId' name='txtbSrITeaId' type='hidden' value="@ViewBag.teaId" />
                <div class="clearfix">
                </div>
            </form>
        </div>
        <!--/search-->



        <article class="col-xs-12 col-sm-12 col-md-12 col-lg-12 sortable-grid ui-sortable">
            <div id="wid-id-0" class="jarviswidget jarviswidget-color-darken jarviswidget-sortable" data-widget-editbutton="false">
                <header>
                    <span class="widget-icon"><i class="fa fa-table"></i></span>
                    <h2>习题列表</h2>
                </header>
                <div style="margin-top: 35px;">
                    <div class="jarviswidget-editbox"></div>
                    <div class="widget-body no-padding">
                        <div role="grid" id="providerGrid" class="dataTables_wrapper form-inline">
                            <div class="table-responsive">

                                <div class="dt-wrapper" style="overflow-y: auto;">
                                    <table class="table table-striped table-bordered table-hover checkboxs">
                                        <!--table head-->
                                        <thead>
                                            <tr>
                                                <th style="width: 1%">
                                                    <input type="checkbox" value="0" />
                                                </th>
                                                <!-- ko foreach: headers -->
                                                <th class="left ">
                                                    <a href="#" data-bind="text: displayText, click: $root.sort" style="color: black"></a>
                                                    <i class="icon-circle-arrow-up" data-bind="    visible: value == $root.orderBy() && $root.isAsc()"></i>
                                                    <i class="icon-circle-arrow-down" data-bind="    visible: value == $root.orderBy() && !$root.isAsc()"></i>
                                                </th>
                                                <!-- /ko -->
                                                <th class="center" style="width: 60px">查看
                                                </th>
                                                <!--add by yzp 编辑试题-->
                                                <th class="center" style="width: 60px">编辑
                                                </th>
                                                <!--end add by yzp 编辑试题-->
                                            </tr>
                                        </thead>
                                        <!--/table head-->
                                        <!--table body(Provider list)-->
                                        <tbody data-bind="foreach: recordSet">
                                            <tr class="selectable" onclick="">
                                                <td class="center">
                                                    <input type="checkbox" name="userSelector" data-bind="value: Id" />
                                                    <input type="hidden" data-bind="value: Id, attr: { id: Id }" />
                                                </td>

                                                <td class='left'><strong data-bind='text: SPracticeName'></strong></td>
                                                <td class='left'><strong data-bind='text:date(DCreateTime)'></strong></td>
                                                <td class='left'><strong data-bind='text: ITotal'></strong></td>
                                                <td class='left'><strong data-bind='text: STeaName'></strong></td>


                                                <td class="center">
                                                    <a href="#" data-bind="click: $root.ReadPra">
                                                        <i class="fa glyphicon glyphicon-eye-open" style="color: black; font-size: 20px;"></i></a>
                                                </td>
                                                <!--add by yzp 练习预览-->
                                                <td class="center">
                                                    <a href="#" class="btn-action glyphicons pencil btn-success" data-bind="click: $root.UpdatePractice">
                                                        <i></i></a>
                                                </td>
                                                <!-- end add by yzp 练习预览-->
                                            </tr>
                                        </tbody>
                                        <!--/table body( Provider list)-->

                                    </table>

                                </div>



                                <!-- 分页 -->
                                <ul class="pagination pagination-alt">
                                    <li>
                                        <a data-bind="click: firstPage"><i class="fa fa-fast-backward "></i></a>
                                    </li>
                                    <li>
                                        <a data-bind="click: prevPage"><i class="fa  fa-backward  "></i></a>
                                    </li>
                                    <li>
                                        <a>
                                            <input id="toPage" type="text" data-bind="value: pageIndex, event: { change: $root.changePageIndex }" style="width: 25px;" />
                                            /共<span data-bind="html: totalPages"></span>页 
                                        </a>
                                    </li>
                                    <li>
                                        <a data-bind="click: nextPage"><i class="fa fa-forward "></i></a>
                                    </li>
                                    <li>
                                        <a data-bind="click: lastPage"><i class="fa fa-fast-forward "></i></a>
                                    </li>
                                </ul>

                                <div class="dt-top-row total  ">
                                    当前记录共：<span data-bind="html: totalCount"></span>条
                                </div>
                                <!--end 分页-->
                            </div>

                            <!-- /分页 -->


                        </div>

                        <!-- /分页 -->




                    </div>
                </div>

            </div>




        </article>

    </div>
    <!--end row-->
</section>



<!--StuPracticeList详细对话框-->
<div id="myModal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="SysUserMessageModalLabel" aria-hidden="true">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                ×</button>
            <h3>布置习题
            </h3>
        </div>

        <div class="modal-body" style="overflow-x: hidden;height:300px;">
           
            
            <input type='hidden' id='txtbID' name='txtbID' />
            <form class="smart-form">
                 
                <section>
                    <label class="label">习题名称</label>
                    <label class="input">
                        <input type='text' id='praName' name='praName' placeholder='' class='span8' />
                    </label>
                </section>
                
               <hr style="margin:15px 0px;"/>
                <span style="margin-top:10px;margin-bottom:15px;">选择练习章节：</span>
                <select multiple="multiple" id="example39" style="display: none;">
                    <option value="multiselect-all">全选</option>
                    @{
                        List<HyEduOnline.Entities.TbTeaCatalog> zhang = new List<HyEduOnline.Entities.TbTeaCatalog>();
                        List<HyEduOnline.Entities.TbTeaCatalog> jie = new List<HyEduOnline.Entities.TbTeaCatalog>();
                        foreach (var item in ViewBag.teaCatalog)
                        {
                            if (item.IParentId == 0)
                            {
                                zhang.Add(item);
                            }
                            else
                            {
                                jie.Add(item);
                            }
                        }
                        int Count = 0;
                        //外层循环 章
                        foreach (var item in zhang)
                        {
                            var Schaper = "#collapseOne-1" + Count;
                            var SchaperId = "collapseOne-1" + Count;
                            Count++;
                        <optgroup label="@item.SNumber&nbsp;@item.STitle">
                            @foreach (var ite in jie)
                            {//内层循环 节
                                if (ite.IParentId == item.Id)
                                { 
                                <option value="@ite.Id">@ite.SNumber&nbsp;@ite.STitle </option>
                                }
                            }
                        </optgroup>
                        }
                    }
                </select>
                <hr style="margin-top:10px;"/>

                <section style="margin-top: 15px;">
                    <div class="form-group">
                        <label class="label">选择练习班级:</label>
                    </div>
                    <div class="inline-group" style="width: 100%;" data-bind="foreach:setClass" id="setClass">
                        <label class="checkbox">
                            <input type='checkbox' name='classBox' data-bind="value:SClassCode" />
                            <i></i>
                            <p data-bind="text:SClassName"></p>
                        </label>
                    </div>
                </section>
            </form>
        </div>

        <div class="modal-footer">
            <button class="btn" data-dismiss="modal" aria-hidden="true">
                取消</button>
            <button id="ok" class="btn btn-primary" data-dismiss="modal" aria-hidden="true" data-bind="click: Add">
                确定</button>
        </div>
    </div>
    <!--end div content-->
</div>
<!--/详细StuPracticeList对话框-->




<script src="~/Js/plugin/multiselect/bootstrap-multiselect.js"></script>
<script type="text/javascript">


    var gdViewModel;
    $(function () {

        $('#example39').multiselect({
            includeSelectAllOption: true,

            filterPlaceholder: 'Search',
            maxHeight: 150
        });




        var courseId = $("#courseId").val();
        $._messengerDefaults = {
            extraClasses: 'messenger-fixed messenger-theme-future messenger-on-bottom messenger-on-right'
        }; //默认提示位置;


        var options = {

            dialogId: "StuPracticeListMessageModal", //添加对话框

            pageSize: 20, //分页大小
            hidId: $("#txtbID"),
            SaveUpdateBtn: $("#btnSaveOrUpdateModel"),
            frmElement: $("#formStuPracticeList"),

            //节点数据
            NodeValue: ko.observable({

                Id: 0,
                SPracticeName: '',
                ICourseId: 0,
                SCouseCode: '',
                ITeaId: 0,
                STeaCode: '',
                ITermId: 0,
                STermName: '',
                DCreateTime: new Date(),
                ITotal: 0,
                STeaName: '',
                SCatalog: '',


            }),


            //用户列表Grid头部列名称
            headers: [


 { displayText: '习题名', value: 'SPracticeName', width: 'auto' },
 { displayText: '生成时间', value: 'DCreateTime', width: 'auto' },
 { displayText: '总分', value: 'ITotal', width: 'auto' },
 { displayText: '发布教师姓名', value: 'STeaName', width: 'auto' },


            ],

            //默认的排序方式
            defaultOrderBy: "Id",
            //用户查询URL
            dataQueryUrlAccessor: function () {
                return "/api/StuPracticeList/GetByPage";
            },

            //添加用户URL
            dataAddUrlAccessor: function () { return "/api/StuPracticeList/Post"; },
            dataUpdateAccessor: function (key) { return "/api/StuPracticeList/Put/" + key; },
            dataNodeSelect: function (id) {
                return "/api/StuPracticeList/get/" + id;
            },

            dataDeleteAccessor: function (data) {
                var userIDs = "";
                var check = $("input:checked");  //得到所有被选中的checkbox
                check.each(function (i) {        //循环拼装被选中项的值
                    userIDs = userIDs + ',' + $(this).val();
                });
                //清除多余的分割号
                userIDs = dropRsplit(userIDs, ",");
                if (userIDs != "") {
                    return appendQueryString("/api/Teacher/DeleteIdsPra", { ids: userIDs });
                } else
                    return "";

            }
			, initEd: function () {
			    //gird初始化的后置事件 信息

			}
            , changeEnd: function () {
                //对话框关闭后 的后置事件

            }
            , showDetailEnd: function (data) {
                //显示对话框详细之后
            }
            , showDlgBefore: function () {
            }

        };

        gdViewModel = new gridViewModel(options);
        gdViewModel.setClass = ko.observableArray();//班级数据  
        gdViewModel.setCata = ko.observableArray();//章节数据  
        //获取班级
        $.ajax({
            url: "/api/Teacher/GetClass",
            type: "POST",
            dataType: "JSON",
            data: { CourseId: courseId }
        }).done(function (data) {
            gdViewModel.setClass(data.cla);//绑定班级
            gdViewModel.setCata(data.cata);//绑定章节
        });
        //查看习题完成情况
        gdViewModel.ReadPra = function (data) {
            window.location.href = "/Teacher/StuPractice?PraId=" + data.Id + "&courseId=" + courseId;
        }

        //更新练习题，点击“编辑”按钮的时候执行
        gdViewModel.UpdatePractice = function (data) {
            var url = "/Teacher/PracticePaperPreview?PracticeID=" + data.Id;
            window.open(url, "_blank");
        }

        //添加班级,章节
        gdViewModel.Add = function () {
            var claCode = "";
            var cataId = "";
            var praName = $("#praName").val();//练习名字

            //循环选择的班级
            var check = $("input[name='classBox']:checked");  //得到所有被选中的checkbox
            check.each(function (i) {        //循环拼装被选中项的值
                claCode = claCode + ',' + $(this).val();
            });
            //清除多余的分割号
            claCode = dropRsplit(claCode, ",");//所选班级


            //循环选择的章节 
            var selected = [];
            $('#example39 option:selected').each(function () {
                selected.push([$(this).val(), $(this).data('order')]);
            });
            for (var i = 0; i < selected.length; i++) {
                cataId += selected[i][0] + ', ';
            }
            cataId = cataId.substring(0, cataId.length - 2);


            $.ajax({
                type: "POST",
                url: "/Api/Teacher/Practice",
                dataType: "JSON",
                data: { cataId: cataId, claCode: claCode, CourseId: courseId, PraName: praName }
            }).done(function (data) {
                if (data == 1) {
                    gdViewModel.init();
                    return false;
                }
                else if (data == -1) {
                    alert("请选择章节！");
                    return false;
                }
                else if (data == -2) {
                    alert("请选择班级！");
                    return false;
                }
                else
                    alert("请刷新页面，重新发布！");
            })
        }



        gdViewModel.init();
        ko.applyBindings(gdViewModel);



        options.frmElement.validate({
            rules: {


                txtbId: { required: true, digits: true }, txtbSPracticeName: { maxlength: 50 }, txtbICourseId: { digits: true }, txtbSCouseCode: { maxlength: 50 }, txtbITeaId: { digits: true }, txtbSTeaCode: { maxlength: 50 }, txtbITermId: { digits: true }, txtbSTermName: { maxlength: 50 }, txtbDCreateTime: { date: true }, txtbITotal: { digits: true }, txtbSTeaName: { maxlength: 50 }, txtbSCatalog: { maxlength: 50 }



            },
            messages: {


                txtbId: { required: '必填项', digits: '必须是整数' }, txtbSPracticeName: { maxlength: '最大长度为100' }, txtbICourseId: { digits: '必须是整数' }, txtbSCouseCode: { maxlength: '最大长度为10' }, txtbITeaId: { digits: '必须是整数' }, txtbSTeaCode: { maxlength: '最大长度为10' }, txtbITermId: { digits: '必须是整数' }, txtbSTermName: { maxlength: '最大长度为25' }, txtbDCreateTime: { date: '必须是日期格式，例如：2013/01/01' }, txtbITotal: { digits: '必须是整数' }, txtbSTeaName: { maxlength: '最大长度为25' }, txtbSCatalog: { maxlength: '最大长度为10' }

            }
        });




    });
    //合并章节名称
    function Merge(d1, d2) {
        return d1 + "." + d2;
    }

    //规范时间显示格式
    function date(date) {
        if (date == "" || date == null)
            return "";
        var dd = date.slice(0, 10);
        var ss = date.slice(11, 19);
        return dd + " " + ss;
    }
</script>






<!--/end grid code-->

